import './styles/tailwind.css';
import { createApp } from 'vue';
import App from './App.vue';
import router, { setupRouter } from './router';
import { setupStore } from '@/store';
import MakeitCaptcha from 'makeit-captcha';
import 'makeit-captcha/dist/captcha.min.css';
import { setupNaive, setupDirectives } from '@/plugins';
import { AppProvider } from '@/components/Application';
import { create, NTransfer, NDatePicker, NCascader, NFormItemGi,NRadioGroup,NRadio,NRadioButton,NImage,NCollapse,NCollapseItem,NH1,NH2,NH3,NH6,NTreeSelect,NCheckbox,NText,NDropdown,NGradientText } from 'naive-ui';
import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css';
import Icon from '@ant-design/icons-vue';
import SvgIcon from './icons/index.vue';
import 'virtual:svg-icons-register';
import WxIcon from './components/WxIcon/index.vue';
async function bootstrap() {
  const appProvider = createApp(AppProvider);

  const app = createApp(App);

  app.use(MakeitCaptcha);

  // 注册全局常用的 naive-ui 组件
  setupNaive(app);

  // 注册全局自定义组件
  //setupCustomComponents();

  // 注册全局自定义指令，如：v-permission权限指令
  setupDirectives(app);

  // 注册全局方法，如：app.config.globalProperties.$message = message
  //setupGlobalMethods(app);

  // 挂载状态管理
  setupStore(app);

  //优先挂载一下 Provider 解决路由守卫，Axios中可使用，Dialog，Message 等之类组件
  appProvider.mount('#appProvider', true);

  // 挂载路由
  await setupRouter(app);

  // 路由准备就绪后挂载APP实例
  await router.isReady();
  app
  .component('svg-icon', SvgIcon)
  .component('wx-icon', WxIcon)
  .use(Antd)
  .use(create({
    components: [
      NDatePicker,
      NCascader,
      NFormItemGi,
      NTransfer,
      NRadioGroup,
      NRadio,
      NRadioButton,
      NImage,
      NCollapse,
      NCollapseItem,
      NH1,
      NH2,
      NH3,
      NH6,
      NTreeSelect,
      NCheckbox,
      NText,
      NDropdown,
      NGradientText
    ]
  }
  ))
  .component(Icon, Icon)
  .mount('#app', true);
}

void bootstrap();
